<!-- 佣金中心 -->
<template>
	<view style="padding-bottom: 150rpx;">
		<view class="commission-wrap1">
			<image mode="widthFix" style="width: 100%;position: absolute;"
				:src="$IMG_URL+'/uploads/20241031/36d402e0c7d40561d870e2c2e52a2963.png'"></image>
			<!-- 标题栏 -->
			<shopro-navbar back-icon-color="#4d4d4d" :background="{}"></shopro-navbar>

		</view>

		<view style="width:92%;margin: auto;position: relative;z-index: 5;margin-top: 30rpx;">
			<view style="display: flex;justify-content: space-between;">
				<view>
					<view style="font-size:50rpx;margin-bottom: 10px;">
						我的邀请
					</view>
					<view>
						总邀请人数{{info.all_count?info.all_count:0}}
					</view>
				</view>
				<view>
					<image style="width: 100rpx;height:100rpx;border-radius: 50%;" :src="info.user.avatar"></image>
				</view>
			</view>

			<view style="display: flex;justify-content: space-between;margin-top: 30rpx;">
				<view style="background: #ebe5fd;flex:1;border-radius: 13rpx;padding:10px 15px;">
					<view style="display: flex;align-items: center;margin-bottom: 5px;">
						<view style="height:13px;background: #9f85f0;width:3px;margin-right:3px;"></view>
						<view>单日人数</view>
					</view>
					<view style="font-size: 18px;">{{info.date_count}}</view>
				</view>
				<view style="background: #ebe5fd;flex:1;margin-left: 10px;border-radius: 13rpx;padding:10px 15px;">
					<view style="display: flex;align-items: center;margin-bottom: 5px;">
						<view style="height:13px;background: #9f85f0;width:3px;margin-right:3px;"></view>
						<view>7天人数</view>
					</view>
					<view style="font-size: 18px;">{{info.date_count_7}}</view>
				</view>
				<view style="background: #ebe5fd;flex:1;margin-left: 10px;border-radius: 13rpx;padding:10px 15px;">
					<view style="display: flex;align-items: center;margin-bottom: 5px;">
						<view style="height:13px;background: #9f85f0;width:3px;margin-right:3px;"></view>
						<view>30天人数</view>
					</view>
					<view style="font-size: 18px;">{{info.date_count_30}}</view>
				</view>
			</view>

			<view style="display: flex;justify-content: space-between;margin-top: 50rpx;">
				<view style="display: flex;align-items: center;">
					<view @click="tapyuan(0)">
						总合
						<view style="height:4px;">
							<view v-if="tindex==0" style="background: #a085f0;width: 21px;height: 4px;margin:auto;border-radius: 5px;">
							</view>
						</view>
					</view>
					<view @click="tapyuan(1)" style="margin-left:40rpx;">单日
						<view style="height:4px;">
							<view v-if="tindex==1" style="background: #a085f0;width:21px;height: 4px;margin:auto;border-radius: 5px;">
							</view>
						</view>
					</view>
					<view @click="tapyuan(7)" style="margin-left:40rpx;">7天
						<view style="height:4px;">
							<view v-if="tindex==7" style="background: #a085f0;width:21px;height: 4px;margin:auto;border-radius: 5px;">
							</view>
						</view>
					</view>
					<view @click="tapyuan(30)" style="margin-left:40rpx;">30天
						<view style="height:4px;">
							<view v-if="tindex==30" style="background: #a085f0;width:21px;height: 4px;margin:auto;border-radius: 5px;">
							</view>
						</view>
					</view>
				</view>
				<view>合计：{{info.sum}}元</view>
			</view>
			
			<view v-if="isdata"  style="display: flex;justify-content: center;">
				<view >
					<image style="width:400rpx;margin-top: 50rpx;" mode="widthFix" src="https://file.aitewan.com/uploads/20230527/9468a04c568f6b0c2d02a1f8958c370e.png"></image>
					<view style="color:#999;display: flex;justify-content: center;">
						暂无数据
					</view>
				</view>
			</view>
			
			<view v-for="(item,index) in info.list" :key="index"
				style="background: #fff;border-radius: 15rpx;padding:10px 13px;display: flex;justify-content: space-between;align-items: center;margin-top:13px;">
				<view style="display: flex;align-items: center;">
					<view>
						<image style="width: 80rpx;height:80rpx;border-radius: 50%;margin-right:10rpx;"
							:src="item.avatar"></image>
					</view>
					<view>
						<view>{{item.nickname}}</view>
						<view style="font-size: 24rpx;color:#afafaf;">{{item.parent_user_time}}</view>
					</view>
				</view>
				<view>{{item.order_sum}}元</view>
			</view>
			
			 

		</view>

		<view @click="showShare = true" style="position: fixed;bottom:0;z-index: 5;display: flex;
		justify-content: center;padding:17px;width:100%;
		background: #a085f0;color: #fff;
		border-top-right-radius: 20px;border-top-left-radius: 20px;">邀请好友</view>
	
		<!-- 	分享组件 -->
		<shopro-share v-model="showShare" posterType="user"></shopro-share>


	</view>
</template>

<script>
	import {
		mapMutations,
		mapActions,
		mapState,
		mapGetters
	} from 'vuex';
	import share from '@/shopro/share';
	export default {
		components: {},
		data() {
			return {
				showShare: false, //是否显示分享海报
				tindex:0,
				isdata:false,
				info:{
					sum:0,
					user:{},
					list:[]
				}
			};
		},
		computed: {
			...mapGetters(['userInfo', 'agentInfo']),
			// showAuthModal: {
			// 	get() {
			// 		return !!this.authNotice.title && !this.hasAuth;
			// 	},
			// 	set(val) {
			// 		return val;
			// 	}
			// }
		},
		onShow() {},
		onHide() {

		},
		onLoad() {
			this.getlist()
		},
		onPullDownRefresh() {

		},
		methods: {
			tapyuan(index){
				this.tindex = index
				this.getlist()
			},
			getlist(){
				this.$http('v1.invitation', {
				  date:this.tindex,
				}).then((res) => {
					this.info = res.data
					if(res.data.list.length){
						this.isdata = false
					}else{
						this.isdata = true
					}
				});
			}
		}
	};
</script>

<style>

</style>